<!-- src/components/Navbar.vue -->
<template>
  <el-menu mode="horizontal">
    <el-menu-item index="1">首页</el-menu-item>
    <el-sub-menu index="2" v-if="user">
      <template #title>{{ user.name }}</template>
      <el-menu-item index="2-1" @click="logout">退出登录</el-menu-item>
    </el-sub-menu>
  </el-menu>
</template>

<script setup  lang="ts">
import { computed } from 'vue'
import { useAuthStore } from '../stores/authStore'

const authStore = useAuthStore()

const user = computed(() => authStore.user)

const logout = () => {
  authStore.logout()
}
</script>
